.el-dropdown-menu {
  &.el-popper .popper__arrow::after {
    content: " ";
    border-width: 6px;
  }
  &.el-popper[x-placement^="bottom"] {
    margin-top: 5px;
  }
  &.el-popper[x-placement^="bottom"] .popper__arrow {
    top: -6px;
    left: 50%;
    margin-right: 3px;
    border-top-width: 0;
    border-bottom-color: #ebeef5;
  }
  &.el-popper[x-placement^="bottom"] .popper__arrow::after {
    top: 1px;
    margin-left: -6px;
    border-top-width: 0;
    border-bottom-color: #fff;
  }
}

.el-dropdown {
  display: inline-block;
  position: relative;
  color: $white;
  font-size: 14px;
  line-height: 20px;
  outline: 0;

  &:focus {
    outline: 0;
  }
}
.el-dropdown-link {
  cursor: pointer;
  &,
  &:focus {
    outline: 0;
  }
}

.el-dropdown-menu {
  &.el-popper {
    .popper__arrow {
      border-width: 6px;
      -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
      filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
    }

    .popper__arrow,
    .popper__arrow::after {
      position: absolute;
      display: block;
      width: 0;
      height: 0;
      border-color: transparent;
      border-style: solid;
    }
  }
}

.el-dropdown-menu {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  padding: 10px 0;
  margin: 5px 0;
  background-color: #fff;
  border: 1px solid #ebeef5;
  border-radius: 4px;
  -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.el-dropdown-menu__item {
  list-style: none;
  line-height: 36px;
  padding: 0 20px;
  margin: 0;
  font-size: 14px;
  color: $font-color;
  cursor: pointer;
  outline: 0;
}
.el-dropdown-menu__item:focus,
.el-dropdown-menu__item:not(.is-disabled):hover {
  background-color: #ecf5ff;
  color: #66b1ff;
}
.el-dropdown-menu__item i {
  margin-right: 5px;
}
.el-dropdown-menu--medium {
  padding: 6px 0;
}
